<template>
    <div class="operation">
        <div class="playAll iconfont iconshipin">播放全部</div>
        <div class="iconfont iconxihuan">收藏({{subscribedCount | playCountFormat}})</div>
        <div class="iconfont iconshare">分享({{shareCount | playCountFormat}})</div>
        <div class="iconfont iconxiazai">下载全部</div>
    </div>
</template>

<script>
import {_playCountFormat} from '../../../util/tool'
export default {
    name: 'operation',
    props: [
        'subscribedCount',
        'shareCount'
    ],
    data() {
        return {

        };
    },
    computed: {

    },
    created() {

    },
    mounted() {

    },
    watch: {

    },
    methods: {

    },
    filters:{
        playCountFormat(count){
            return _playCountFormat(count)
        }
    },
    components: {

    },
};
</script>

<style scoped lang="less">
@itemecolor:#E03F40;
@infoColor:#ccc;
.position_flex(@jc:space-between,@ai:center){
  display: flex;
  align-items: @ai;
  justify-content: @jc;
}
.btn_style{
    border-radius: 5px;
    padding: 7px;
    margin-right: 10px;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.5);
    cursor: pointer;
    background-color: #192a56
}
.operation{
    .position_flex(flex-start);
    margin-top: 10px;
    div{
        .btn_style;
        
    };
    div:hover{
        background-color: @infoColor;
    }
    .playAll{
        background-color: @itemecolor;
    }
    
}
</style>
